[pull] main from chakra-ui:main - #298

* feat: toc component implementation

* fix: toc components

* implemented minor changes on the svelte

* rerfactored react components

* fix: lint and test errors

* chore: update lockfile

* storybook fixes

* chore: refactored toc examples

* updated package

* fix the build issues

* chore: aded documentation to the toc component

* chore: toc component framework polishing

* test units

* chore: wording categories

* fix: style hmr

* chore: wip

* fix: update toc scroll element prop

* feat: add toc showcase examples

* docs: add toc showcase patterns

* chore: remove toc showcase examples

* chore: clean up toc implementation

* fix(react): unwrap react.lazy asChild children across the RSC boundary (#3980)

* fix(react): unwrap react.lazy asChild children across the RSC boundary

React's Flight protocol hands children across the server components
boundary wrapped in Symbol(react.lazy), which isValidElement rejects. The
factory bailed out and rendered neither the child nor the element it stood
in for.

Unwrap the lazy child with Children.toArray, gated on the lazy symbol so
every non-RSC path keeps its existing behavior. Matches the approach used
by Base UI; Radix solves the same bug via use().

Verified end-to-end against a Next.js 15 production build: an async server
component passed through asChild prerendered <main></main> before, and now
renders the child with className and data attributes merged.

Refs react/react#32392

Claude-Session: https://claude.ai/code/session_0133qcH6rpUR3edEeGJSxsF1

* test(react): cover ref composition through a react.lazy asChild child

The factory resolves the lazy child before reading its ref and before
merging props, so refs on a child that crossed the RSC boundary still
attach. Nothing covered that ordering.

Reading the ref or props off the un-unwrapped wrapper fails this test plus
the two existing lazy tests, while the nine non-lazy tests keep passing.

Claude-Session: https://claude.ai/code/session_0133qcH6rpUR3edEeGJSxsF1

* docs(vue): document Toc RootProps and RootEmits

Ports the prop documentation from the pre-rebase branch snapshot. The
wording matches the JSDoc on zag's TocProps.

Keeps the prop named scrollEl. The snapshot called it getScrollEl, but
@zag-js/toc 1.43.1 defines scrollEl, and UseTocProps spreads straight into
the machine with no mapping.

Claude-Session: https://claude.ai/code/session_0133qcH6rpUR3edEeGJSxsF1

* docs(toc): explain the shape of the items prop

Adds a Guides section covering what each entry needs. value must match the
heading's id, since the machine resolves it with getElementById, and depth
mirrors the heading tag but does not indent anything on its own.

Also notes that annotating the array as TocItemData[] rejects extra
properties like label, and shows extending the type instead.

Claude-Session: https://claude.ai/code/session_0133qcH6rpUR3edEeGJSxsF1

* feat(toc): add a rail example across all frameworks

Renders a nested rail beside the navigation. Each item draws a small SVG
line offset from its depth, and a bezier joins the two offsets wherever
neighbouring items sit at different depths, so the rail steps in and out
rather than breaking. The active item strokes its own segment, so a run of
active items reads as one highlight.

The SVG carries an explicit height. It is a replaced element, so leaving
height auto resolves to the intrinsic 150px and the segments stack through
each other rather than spanning their row.

Adds a Guides entry on the docs page and regenerates the example registry.

Claude-Session: https://claude.ai/code/session_0133qcH6rpUR3edEeGJSxsF1

* refactor(toc): use the scrollTo api in the select example

The change handler resolved the heading with querySelector and called
scrollIntoView. That walks every scrollable ancestor rather than the
container passed to scrollEl, hardcodes smooth so the scrollBehavior prop
is ignored, and throws on ids that are not valid CSS selectors.

api.scrollTo resolves by id, honours scrollBehavior, and scrolls only the
element scrollEl returns.

Claude-Session: https://claude.ai/code/session_0133qcH6rpUR3edEeGJSxsF1

* refactor(toc): type contentRef as the element Toc.Content renders

Toc.Content forwards HTMLElement and renders an article, so the refs were
typed as HTMLDivElement for an element that is never a div. It compiled
because RefObject<HTMLDivElement> is assignable to Ref<HTMLElement>.

Also settles the split over the null union, which four of the examples
carried and five did not.

Claude-Session: https://claude.ai/code/session_0133qcH6rpUR3edEeGJSxsF1

* chore(toc): add release changeset and mark the docs page as preview

The component and its docs page are new on this branch with no changeset,
so merging would have added a documented component that never got a
version bump. Bumps all four packages at minor.

Marks the page Preview alongside Drawer and Splitter, since the prop names
are still moving.

Claude-Session: https://claude.ai/code/session_0133qcH6rpUR3edEeGJSxsF1

* fix(toc): prefix example heading ids so they stay unique per page

The docs page renders every Toc example at once, and zag resolves headings
with document.getElementById. Examples shared ids like overview, installation
and usage, so an example observed headings belonging to a different example
and highlighted the wrong item. Scrolled to the top, the rail example
highlighted Package Manager instead of Overview.

Each example now prefixes its ids with its own number. Verified on the docs
page: every example resolves only its own headings, where two previously
resolved four and five foreign ones.

* fix(website): generate the missing toc and interaction type docs

The API Reference table on the Toc page was empty. generate-type-docs reads
built .d.ts files rather than source, and dist predated both components, so
it had nothing to read.

Adds toc and interaction across all four frameworks, and picks up two stale
entries along the way: qr-code gained an overlay id, and date-picker's
translations became Partial<IntlTranslations>.

Run document:types with document:tags after it. document:types alone drops
the tag fields that document:tags adds.

* fix(toc): use explicit file extensions in index exports

Toc was the only component whose index omitted them; every other component
exports from './x.tsx' or './x.ts'.

* docs(toc): tighten the page and give the indicator room

Cuts the prose from 599 to 434 words, mostly restatement of what each example
already shows, and documents that heading ids are global to the page, which is
what broke the examples when several rendered together.

Moves the indicator 12px from the label instead of 6px.

* fix(scripts): skip writing empty type docs

Hook-only modules like interaction and collection document no props, so the
generator wrote `{}` files that nothing renders. Removes the ten already
committed and stops emitting new ones.

---------

Co-authored-by: Segun Adebayo <joseshegs@gmail.com>